// 入口函数
$(function() {

    // 参数设置为全局对象,疑问将来筛选和分页都要用
    let q = {
        pagenum: 1, //是 int 页码值
        pagesize: 2, //是  int 每页显示多少条数据
        cate_id: '', //否 string 文章分类的Id
        state: '' // 否 string 文章的状态,可选值有已发布、草稿
    }


    initArticleList()
        // 初始化文章列表 全局函数
    function initArticleList() {
        // 发送axios
        axios({
            method: 'GET',
            url: '/my/article/list',
            params: q
        }).then(function(res) {
            // console.log(res);
            if (res.data.status !== 0) {
                return layer.msg(res.data.message)
            }
            let arr = []
            res.data.data.forEach(function(ele) {
                arr.push(`
                <tr>
                     <td>${ele.title}</td>
                     <td>${ele.cate_name}</td>
                     <td>${formatDate(ele.pub_date)}</td >
                     <td>${ele.state}</td>
                     <td>
                         <button class="layui-btn layui-btn-xs">编辑</button>
                         <button data-id="${ele.Id}" class="del-btn layui-btn layui-btn-xs layui-btn-danger">删除</button>
                     </td>
                 </tr >

                    `)
            })
            $('tbody').empty().html(arr.join(''))
            renderPage(res.data.total)
        })
    }

    // 需求2 渲染
    let form = layui.form
    initArtCateList()

    function initArtCateList() {
        // 发送axios
        axios({
            method: 'GET',
            url: '/my/article/cates',
        }).then(function(res) {
            // console.log(res);
            if (res.data.status !== 0) {
                return layer.msg(res.data.message)
            }
            // 渲染文章分类 遍历每个值
            let arr = ['<option value="">请选择文章所属分类</option>']
            res.data.data.forEach(function(ele) {
                    arr.push(`
                <option value="${ele.Id}">${ele.name}</option>
                `)
                })
                // 拼接成字符串
            $('[name=cate_id]').empty().html(arr.join(''))
            form.render() //可以渲染layui中的 select/checkbox/radio

        })
    }

    // 需求三 筛选
    $('#searchForm').submit(function(e) {
        e.preventDefault()
        q.cate_id = $('[name=cate_id]').val()
        q.state = $('[name=state]').val()
            // 重新渲染 页面
        initArticleList()

    })

    // 需求四 分页筛选
    let laypage = layui.laypage

    // 实现分页功能
    function renderPage(total) {
        laypage.render({
            elem: 'pageBox', //注意 这里是 test1 是Id 不用加#
            count: total, //数据总数, 从服务端得到
            limit: q.pagesize, // limit 每页显示的条数
            curr: q.pagenum, //curr 控制当前页面
            layout: ['count', 'limit', 'prev', 'page', 'next', 'refresh', 'skip'],
            limits: [2, 3, 5, 10],
            jump: function(obj, first) {
                // obj 包含了当前分页的所有参数
                // 首次不执行
                // layui 官网能够查到页码切换触动的事件 jump()
                if (!first) {
                    q.pagenum = obj.curr
                    q.pagesize = obj.limit
                    initArticleList()
                }

            }

        })

    }

    // 需求5删除
    $('tbody').on('click', '.del-btn', function() {
        // 获取id
        let id = $(this).attr('data-id')
        console.log(id);
        // 发送axios
        layer.confirm('是否删除 ?', { icon: 3, title: '提示' }, function(index) {
            //do something
            axios({
                method: 'GET',
                url: '/my/article/delete/' + id,
            }).then(function(res) {
                if (res.data.status !== 0) {
                    return layer.msg(res.data.message)
                }
                layer.msg('删除成功')
                    // (删除axios成功后) 当我们再次发起请求的时候,如果页面中还有一条数据,当前页--,当前页大于等于2有资格
                    // if($('.del-btn').length==1&&q.pagenum>=2)q.pagenum--
                    // 优化 - 短路运算,前面的代码满足条件,后面才会执行
                $('.del-btn').length == 1 && q.pagenum >= 2 && q.pagenum--
                    initArticleList()
            })

            layer.close(index);
        });


    })


})


console.log(['😅😅😅😅😅😅😅😅😅']);